var map, poly;
var   marker, gpoints = [];
var marker_point = [];
        var html = [];
        var point = []; 

  function initialize() {
    var myLatlng = new google.maps.LatLng(51.1657, 10.4515);
    var myOptions = {
      zoom: 4,
      center: myLatlng,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    }
 
document.map = map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);

//NAVIGATION
    var sv = document.createElement('Save');
    var st = document.createElement('Start');
    var stp = document.createElement('Stop');
    
    var saveControl = new Save(map, sv);
    saveControl.index = 1;
    var startControl = new Start(map, st);
    startControl.index = 1;
    var stopControl = new Stop(map, stp);
    stopControl.index = 1;
    
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(sv);
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(st);
    map.controls[google.maps.ControlPosition.TOP_LEFT].push(stp);

}
 $(document).ready(function(){

         
function getPoints(){
     var imei = '352599044008824';
     var id = window.location.pathname.substr(22);
     if(!gpoints['imai']){
         
     gpoints['imei'] = [];
     
     $.getJSON("/ajax/getonepoint", {id:id}, function(data){
         //обработчик результатов запроса
         setMarkerRealTime(data, id);
         

     });
 }
 }
 function getAllPoints(){


     var imei = '352599044008824';
     var id = window.location.pathname.substr(22);     
     if(!gpoints['imai']){
         
     gpoints['imei'] = [];
     
     $.getJSON("/ajax/getfullpoints", {id:id}, function(data){
         //обработчик результатов запроса
         setMarkers(data, id);
        
     });
      
 }
}


//getAllPoints();
 setInterval(getPoints, 5000);
 setTimeout(getAllPoints, 1000);

 
 
    function downloadUrl(url, callback) {
      var request = window.ActiveXObject ?
          new ActiveXObject('Microsoft.XMLHTTP') :
          new XMLHttpRequest;
 
      request.onreadystatechange = function() {
        if (request.readyState == 4) {
          request.onreadystatechange = doNothing;
          callback(request.responseText, request.status);
        }
      };
 
      request.open('GET', url, true);
      request.send(null);
    }
 
    function doNothing() {}
    
    /////////////////////////////////////////////////////////////////////////////
    var polyOptions = {
      strokeColor: '#000000',
      strokeOpacity: 1.0,
      strokeWeight: 3
    }
    poly = new google.maps.Polyline(polyOptions);
    poly.setMap(map);
    /////////////////////////////////////////////////////////////////////////////
    function addLatLng(point) {
      var polyOptions = {
      strokeColor: '#000000',
      strokeOpacity: 1.0,
      strokeWeight: 3
    }
    poly = new google.maps.Polyline(polyOptions);
    poly.setMap(map);

       var path = poly.getPath();
       alert(path);

       // Так как path это массив типа MVCArray, мы можем просто добавить
       // новую координату и она автоматически появится.
       path.push(point);
       // Добавляем маркер в точке соединения отрезков (место клика).
       var marker = new google.maps.Marker({
               position: point,
           //    title: '#' + path.getLength(),
               map: map
       });
}
   //////////////////////////////////////////////////////////////////////////////

    function polyline(flightPlanCoordinates){
      var pathOptions = {
        path: flightPlanCoordinates,
        strokeColor: '#0000CC',
        opacity: 0.4,
        map: map
    }
    polyline = new google.maps.Polyline(pathOptions);
}
 
	function setMarkers(data) {
 
	var infoWindow = new google.maps.InfoWindow;	 
        var p;
	for(var i = 0; i < data.points.length; i++) {
        if(i == 0){ p = '<strong>Start point<br /></strong>';}
        if(i == data.points.length - 1){ p = '<strong>End point<br /></strong>';}
        	
    	marker_point[i] = new google.maps.LatLng(data.points[i].latitude, data.points[i].longitude);	
	html[i] = p+'<strong>Speed '+data.points[i].speed+' km</strong><br /><strong>Battery '+data.points[i].battery+' %</strong>';
        icon = data.points[i].mimg;
//	createMarker(marker_point[i], html[i], icon, infoWindow );
     
    }
       createMarker(marker_point[0], html[0], icon, infoWindow );
       createMarker(marker_point[data.points.length -1], html[data.points.length - 1], icon, infoWindow);
       //отображаем все точки на карте соеденненные линией
                              
            var pathOptions = {
        path: marker_point,
        strokeColor: '#7859A6',
        strokeWeight: 4,
        opacity: 0.4,
        map: map
    }
        polyline = new google.maps.Polyline(pathOptions);
        polyline.setMap(map);
    
        }
        
        
        //устанавливаем маркер в реальном времени и соединяем линией
        function setMarkerRealTime(data) {
 
	var infoWindow = new google.maps.InfoWindow;	 

	for(var i = 0; i < data.points.length; i++) {	
    	marker_point[i] = new google.maps.LatLng(data.points[i].latitude, data.points[i].longitude);	
	html[i] = '<strong>Speed '+data.points[i].speed+' km</strong><br /><strong>Battery '+data.points[i].battery+' %</strong>';
        icon = data.points[i].mimg;
	//createMarker(marker_point[i], html[i], icon, infoWindow);
        
        }
           
       //отображаем все точки на карте соеденненные линией                    
        var pathOptions = {
        path: marker_point,
        strokeColor: '#7859A6',
        strokeWeight: 4,
        opacity: 0.4,
        map: map
    }
        polyline = new google.maps.Polyline(pathOptions);
        polyline.setMap(map);
    
        
  }//end setMarkerRealTime


function createMarker(point, html, icon, infoWindow) {
	 var marker = new google.maps.Marker({
            map: map,
            position: point,
            icon: '/uploads/gps/car.png' //+icon //+icon.icon
            //shadow: icon.shadow           
          });
 
  
 
  google.maps.event.addListener(marker, 'click', function() {
        infoWindow.setContent(html);
        infoWindow.open(map, marker);
      });
  gpoints.push(marker);
  return marker;
}

function saveRoute(id) {
    var data = 'id=' + id; 
    $.ajax({
        type: "POST",
        url: "saverealtime",
        data: data,
        complete: function() {
            alert('Route saved');
        }
    });
}

$('#view').click(function(){
     var id = window.location.pathname.substr(22);
     saveRoute(id);
 });

 

  }); //end ready

function saveGpsData() {
     data = 'test';
     $.ajax({
         type: "POST",
         url: "savegpsdata",
         data: data
    }); 
 }

setInterval(function(){saveGpsData()}, 5000);

function Save(map, div) {

	//элемент div, который будет кнопкой на карте
	var controlDiv = div;

	// Настройка CSS для отображения кнопки
	//controlDiv.style.padding = '10px';
        controlDiv.style.background = 'url(/img/save6245.png)';
        controlDiv.style.width = '32px';
        controlDiv.style.height = '32px';
        //controlDiv.style.color = '#fff';
        //controlDiv.style.backgroundColor = 'blue';  
        controlDiv.style.fontSize = '15px'; 
        controlDiv.style.margin = '0px 5px 0px 0px';

        //SAVE ROUTE
	//var saveRouteUI = document.createElement('save');
	//saveRouteUI.title = 'click save route';
	//controlDiv.appendChild(saveRouteUI);

	//var saveRouteText = document.createElement('save');
	//saveRouteText.innerHTML = 'Save route';
	//saveRouteUI.appendChild(saveRouteText);
        
        

	// Установка обработчика событий для кнопки save
	google.maps.event.addDomListener(controlDiv, 'click', function() {
		//получаем imei выбранного чекбокса
                //var imei = $("input[type=checkbox]:checked").val();
                //if (imei != null) {
                    //saveRoute(imei);
               // } else {
                //    alert('Please, select a car!');
               // }
        });
}


function Start(map, div) {

	//элемент div, который будет кнопкой на карте
	var controlDiv = div;

	// Настройка CSS для отображения кнопки
	//controlDiv.style.padding = '10px';
        controlDiv.style.background = 'url(/img/player_start_9486.png)';
        controlDiv.style.width = '32px';
        controlDiv.style.height = '32px';
        controlDiv.style.color = '#fff';
        //controlDiv.style.backgroundColor = 'red';
        controlDiv.style.fontSize = '15px';       
        controlDiv.style.margin = '0px 5px 0px 5px';
      
        //START TRACKING        
        //var startTrackingUI = document.createElement('start');
	//startTrackingUI.title = 'Click to start tracking';
	//controlDiv.appendChild(startTrackingUI);

	//var startTrackingText = document.createElement('start');
	//startTrackingText.innerHTML = '';
	//startTrackingUI.appendChild(startTrackingText);

        // Установка обработчика событий для кнопки start:
	google.maps.event.addDomListener(controlDiv, 'click', function() {
		//some action
               //saveGpsDataID = setInterval(function(){saveGpsData()}, 5000);
                //show(imei);
	});
}

function Stop(map, div) {

	//элемент div, который будет кнопкой на карте
	var controlDiv = div;

	// Настройка CSS для отображения кнопки
	//controlDiv.style.padding = '10px';        
        controlDiv.style.background = 'url(/img/stop2675.png)';
        controlDiv.style.width = '32px';
        controlDiv.style.height = '32px';
        controlDiv.style.color = '#fff';
        //controlDiv.style.backgroundColor = 'red';
        controlDiv.style.fontSize = '15px';       
        controlDiv.style.margin = '0px 0px 0px 5px';
        controlDiv.id = 'stop';
        
        //STOP TRACKING
	//var stopTrackingUI = document.createElement('stop');
	//stopTrackingUI.title = 'Click to stop tracking';
	//controlDiv.appendChild(stopTrackingUI);

	//var stopTrackingText = document.createElement('stop');
        //stopTrackingText.innerHTML = 's';
	//stopTrackingUI.appendChild(stopTrackingText);

       
	// Установка обработчика событий для кнопки stop:
	google.maps.event.addDomListener(controlDiv, 'click', function() {
		//some action

                //останавливаем проложение маршрута в реальном времени
                //if(realTimeID)
                //clearInterval(realTimeID);
                
                //останавливаем обновление точек
                //if(saveGpsDataID)
                //clearInterval(saveGpsDataID);
                //скрываем маршрут
                //hide(imei);
	});
}

function test(){
    alert('test');
}
